<template>
    <section>

        <div>
            <div class="div_1">

                <h2>单件费用</h2>
                <table class="t">
                    <thead>
                        <tr>
                            <th style="width:150px">名称

                            </th>
                            <th>备注
                            </th>
                            <th>单价
                            </th>
                            <th>数量
                            </th>

                            <th>小计
                            </th>
                            <th>操作
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="(item,index) in currObj.detail2">
                            <td>
                                <span v-text="item.wageClass.name" v-if="item.wageClass.id!='zdy'"></span>
                                <el-input v-else style="width:80%" size="small" placeholder="自定义" v-model="item.wageClass.name">
                                </el-input>
                            </td>
                            <td>
                                <el-input size="small" placeholder="请输入内容" v-model.number="item.memo">
                                </el-input>
                            </td>
                            <td>
                                <el-input size="small" placeholder="请输入内容" @change="count('2')" v-model.number="item.price">
                                </el-input>
                            </td>
                            <td>
                                <el-input size="small" placeholder="请输入内容" @change="count('2')" v-model.number="item.num">
                                </el-input>
                            </td>

                            <td> <span v-text="item.amount"></span>
                            </td>
                            <td>
                                <el-button size="small" @click="delDetal(index, currObj.detail2)">删除</el-button>
                            </td>
                        </tr>
                        <tr>

                            <td colspan="3"></td>
                            <td>合计</td>
                            <td>{{amount2}}</td>
                            <td></td>
                        </tr>
                    </tbody>
                </table>


                <el-popover ref="popover4" placement="right" width="400" trigger="click">

                    <div>
                        <el-button class="btn_wage" v-for="wageClass in getWageClass()" @click.prevent="addDetail2(wageClass)" type="primary">{{wageClass.name}}</el-button>

                    </div>
                    <span slot="footer" class="dialog-footer">
    <el-button @click="showSelWageClass = false">取 消</el-button>
  </span>
                    <el-button slot="reference"> 新增一行</el-button>
                </el-popover>
            </div>

            <div class="div_1">
                <h2>合计费用</h2>
                <table class="t">
                    <thead>
                        <tr>
                            <th style="width:150px">名称
                            </th>
                            <th>备注
                            </th>

                            <th>单价
                            </th>
                            <th>数量
                            </th>
                            <th>小计
                            </th>
                            <th>操作
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="(item,index) in currObj.detail">
                            <td>
                                <span v-text="item.wageClass.name" v-if="item.wageClass.id!='zdy'"></span>

                                <el-input v-else style="width:80%" size="small" placeholder="自定义" v-model="item.wageClass.name">
                                </el-input>
                            </td>
                            <td>
                                <el-input size="small" placeholder="请输入内容" v-model.number="item.memo">
                                </el-input>
                            </td>
                            <td>
                                <el-input size="small" placeholder="请输入内容" @change="count('')" v-model.number="item.price">
                                </el-input>
                            </td>
                            <td>
                                <el-input size="small" placeholder="请输入内容" @change="count('')" v-model.number="item.num">
                                </el-input>
                            </td>

                            <td> <span v-text="item.amount"></span>
                            </td>
                            <td>
                                <el-button size="small" @click="delDetal(index, currObj.detail)">删除</el-button>
                            </td>
                        </tr>
                        <tr>

                            <td colspan="3">合计</td>
                            <td>合计</td>

                            <td>{{amount}}</td>
                            <td></td>

                        </tr>
                    </tbody>
                </table>




                <el-popover ref="popover4" placement="right" width="400" trigger="click">

                    <div>
                        <el-button class="btn_wage" v-for="wageClass in getWageClass()" @click.prevent="addDetail(wageClass)" type="primary">{{wageClass.name}}</el-button>

                    </div>
                    <span slot="footer" class="dialog-footer">
    <el-button @click="showSelWageClass = false">取 消</el-button>
  </span>
                    <el-button slot="reference"> 新增一行</el-button>
                </el-popover>


            </div>
        </div>

    </section>
</template>
<script src="./t200.js"></script>

<style lang="scss" scoped>
    .div_1 {
        padding: 10px;
        border: 1px solid #eee;
    }


    .btn_wage {
        margin: 5px
    }
</style>